<template>
  <div class="flex h-full">
    <div class="w-85 h-full p-4 flex-shrink-0 border-r flex flex-col border-gray-200 overflow-y-auto">
      <a-input class="mb-4" v-model:value.trim="state.searchName" placeholder="请输入搜索关键字" allow-clear @change="getFolderTree">
        <template #suffix v-if="!state.searchName">
          <SearchOutlined style="color: #999" />
        </template>
      </a-input>
      <a-tree
        v-if="state.treeData.length > 0"
        v-model:selectedKeys="state.selectedKeys"
        v-model:expandedKeys="state.expandedKeys"
        class="tree-warpper"
        :block-node="true"
        :tree-data="searching ? state.treeData : state.searchData"
        :field-names="{ title: 'name', children: 'children', key: 'id' }"
        show-icon
        default-expand-all
        @select="(_, { node }) => folderClick(node)"
      >
        <template #icon="{ level }">
          <template v-if="level === 0">
            <i class="iconfont icon-folder"></i>
          </template>
          <template v-if="![0, -1].includes(level)">
            <i class="iconfont icon-xiangmuerjiwenjianjia"></i>
          </template>
          <template v-if="level === -1"> </template>
        </template>
      </a-tree>
    </div>
    <div class="px-4" :style="{ width: 'calc(100% - 340px)' }">
      <DynamicForm class="mt-4" :config="dyConfig" :questions="dyQuestions" />
      <DynamicTable :tables="dyTable" :config="dyTableConfig" :icons="dyIcons" ref="fileRef">
        <!-- 面包屑 -->
        <template #title>
          <div>
            <a-breadcrumb>
              <template v-for="(item, index) in breadcrumbs" :key="index">
                <a-breadcrumb-item :class="index === breadcrumbs.length - 1 ? null : 'hierarchy'" @click="folderClick(item)">{{ item.name }}</a-breadcrumb-item>
              </template>
            </a-breadcrumb>
          </div>
        </template>
        <!-- 文件夹及文件-->
        <template #fileImg="{ record }">
          <img v-if="record.folder" class="w-11.5 h-11.5 cursor-pointer" @click="folderClick(record)" :src="personalFolder(record.level)" alt="" />
          <img v-else @click="fileClick(record)" class="w-11.5 h-11.5 cursor-pointer" :src="checkFileIcon(record.suffix)" alt="" />
        </template>
        <template #fileName="{ record }">
          <div>
            <p class="text-4 text-black text-opacity-65 cursor-pointer" style="margin: 0">
              <span v-if="record.folder" @click="folderClick(record)">{{ record.name }}</span>
              <span v-else @click="fileClick(record)">{{ record.name }}</span>
            </p>
          </div>
        </template>
        <template #size="{ record }">
          <div class="content fix-margin">
            <!-- <p>{{ record.folder ? '文件夹' : record.suffix && record.suffix.toLocaleUpperCase() }}</p> -->
            <p>{{ changeByte(record.size) }}</p>
          </div>
        </template>
        <template #modifier="{ record }">
          <div class="content fix-margin">
            <!-- <p>修改人</p> -->
            <p>{{ record.modifierName }}</p>
          </div>
        </template>
        <template #updateTime="{ record }">
          <div class="content fix-margin">
            <!-- <p>修改时间</p> -->
            <p>{{ record.modifiedTime }}</p>
          </div>
        </template>
        <template #authority="{ text }">
          <div class="content fix-margin">
            <p class="over" :title="text">{{ text }}</p>
          </div>
        </template>
      </DynamicTable>
    </div>
  </div>
  <ViewDialog
    v-model:visible="state.showDetail"
    v-if="state.showDetail"
    :data="state.showData"
    :currentLevel="state.currentLevel"
    :show-type="state.showType"
    @handleEdit="handleEdit"
    :isSecendLev="isSecendLev"
  />
  <!-- :isSecendLev="isSecendLev" 去除属性 -->
</template>

<script lang="ts" setup>
import { computed, getCurrentInstance, nextTick, onMounted, onBeforeUnmount, reactive, ref, watch, createVNode } from 'vue';
import { DynamicForm, DynamicTable } from '@/components/public-template';
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { Api, projectBatchDelete, projectGet, projectGetChildrenFolders, projectSave, fileGetPreviewFileUrl, fileOptlist, setAsCurrent } from '@/config/api/projectFile';
import { message, Modal } from 'ant-design-vue';
import { fileCopyFile, fileMoveFile, fileCopyFolder, fileMoveFolder } from '@/config/api/fileInfo';
import {
  CUSTOMEVENTSERVE,
  DYNAMICLAYERFORM,
  DYNAMICLAYERCLEAR,
  DYNAMICLOCALICONS,
  DYNAMICLOCALTABLE,
  DYNAMICLTABLEDELETE,
  SEARCHSERVE,
  INPUTSERVE,
  LOCALSUBSERVE,
  RESETTABLE,
  UPLOADESERVE,
  DYNAMICLAYERTABLE
} from '@/mixins/subject/subject-types';
import { filter } from 'rxjs/operators';
import indexService from './index.service';
import ViewDialog from './components/viewDialog.vue';
import { changeByte, reviewFile } from '@/utils/common';
import { downloadFile } from '@/utils/useDownload';
import { SUB_SYSTEM } from '@/enums/commonEnum';
import { checkFileIcon } from '@/utils/common';
import publicFolder from '@/assets/img/fileImg/filePublicFolder.png';
import personalImg from '@/assets/img/fileImg/filePersonalFolder.png';

const state = reactive({
  searchName: '',
  searchData: [],
  selectedKeys: [],
  expandedKeys: [], //默认展开的树节点
  treeData: [],
  showData: null,
  showDetail: false,
  showType: '',
  currentLevel: null,
  level: null,
  id: '', // 本地当前用户id
  permission: [], // 权限配置参数
  filePage: []
});
state.id = JSON.parse(window.localStorage.getItem('LOGIN__INFO__'))['id'];

const fileRef = ref(null);
const breadcrumbs: any = ref([]);
const { proxy }: any = getCurrentInstance();
const dyConfig: any = {
  labelCol: 4,
  wrapperCol: 18,
  grid: 12, // 分栏
  style: 'table-form',
  cancelSave: true // 隐藏底部按钮
};
const dyTableConfig: any = reactive({
  name: 'projectFile',
  queryUrl: Api.projectQueryFolderWithFilePage,
  protType: 'post',
  isShowHeader: true,
  autoSearch: true,
  rowSelection: {
    type: 'checkbox'
  },
  params: { parentId: '', ignoreUploadingFile: true }, // ignoreUploadingFile 默认忽略C端正在上传的文件
  beforeWithMethod: (data) => {
    state.filePage = data;
    data.forEach((item) => {
      if (item.canCopy || item.canMove || item.canCreate || item.canDelete || item.canDownload || item.canEdit) {
        item.moreBtn = true;
      } else {
        item.moreBtn = false;
      }
      item.permissionConfiguration = permissionDisplay(item);
      delete item.children;
    });
    return data;
  }
});
const dyQuestions: any = reactive(indexService.getQuestions());
const dyTable: any = reactive(indexService.getTables());
const dyIcons: any = reactive(indexService.getIcons());

// 文件权限展示
function permissionDisplay(record) {
  let authorityType = {
    canCopy: '复制',
    canCreate: '创建文件夹',
    canDelete: '删除',
    canDownload: '下载',
    canEdit: '编辑',
    canMove: '移动',
    canUpload: '上传'
  };

  if (record) {
    let arr = [];
    Object.keys(authorityType).forEach((item) => {
      if (record[item]) {
        arr.push(authorityType[item]);
      }
    });
    return arr.join('、');
  }
}

// 文件夹图片展示
function personalFolder(level) {
  return level === 0 ? personalImg : publicFolder;
}

const subscribeSub = proxy.$NotificationFormSub
  .getParams()
  .pipe(filter((res) => res !== 0))
  .subscribe((item: any) => {
    try {
      if (item.key === INPUTSERVE && item.value.name === 'searchName') {
        // 条件查询全部文件
        dyTableConfig.params.parentId = '';
      } else if (item.key === SEARCHSERVE && !item.value?.name) {
        // 重置回到面包屑定位
        dyTableConfig.params.parentId = state.selectedKeys[0];
      } else if (item.key === LOCALSUBSERVE && item.state.name == dyTableConfig.name) {
        // 上方按钮-添加
        const form = JSON.parse(JSON.stringify(item.value));

        if (form.projectFilePermissionDTOS) {
          form.projectFilePermissionDTOS.forEach((prItem) => {
            prItem.memberIds = prItem.memberIds.join(',');
          });
        }
        const params = { ...form, parentId: dyTableConfig.params.parentId };
        if (params.projectFilePermissionDTOS && params.projectFilePermissionDTOS.length == 0) {
          delete params.projectFilePermissionDTOS;
        }
        projectSave(params).then((result) => {
          if (result.success) {
            message.success(!form.id ? '添加成功' : '修改成功');
            getProjectFileTree(); // 更新目录
            proxy.$NotificationPubSub.pushParams({ key: DYNAMICLAYERCLEAR, value: { name: 'form' } }); // 取消弹层
            proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
          }
        });
      } else if (item.key === RESETTABLE && item.value.name === 'fileRenaming') {
        getProjectFileTree(); // 更新目录
        proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
      } else if (item.key === LOCALSUBSERVE && item.state.name == 'fileCopying') {
        // 文件复制
        fileCopyFile(item.value).then((res) => {
          if (res.success) {
            message.success('复制成功');
            proxy.$NotificationPubSub.pushParams({ key: DYNAMICLAYERCLEAR, value: { name: 'fileCopying' } }); // 取消弹层
            proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
          }
        });
      } else if (item.key === LOCALSUBSERVE && item.state.name == 'fileMoving') {
        // 文件移动
        fileMoveFile(item.value).then((res) => {
          if (res.success) {
            message.success('移动成功');
            proxy.$NotificationPubSub.pushParams({ key: DYNAMICLAYERCLEAR, value: { name: 'fileMoving' } }); // 取消弹层
            proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
          }
        });
      } else if (item.key === LOCALSUBSERVE && item.state.name == 'folderCopying') {
        // 文件夹复制
        fileCopyFolder(item.value).then((res) => {
          if (res.success) {
            message.success('复制成功');
            getProjectFileTree(); // 更新目录
            proxy.$NotificationPubSub.pushParams({ key: DYNAMICLAYERCLEAR, value: { name: 'folderCopying' } }); // 取消弹层
            proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
          }
        });
      } else if (item.key === LOCALSUBSERVE && item.state.name == 'folderMoving') {
        // 文件夹移动
        fileMoveFolder(item.value).then((res) => {
          if (res.success) {
            message.success('移动成功');
            getProjectFileTree(); // 更新目录
            proxy.$NotificationPubSub.pushParams({ key: DYNAMICLAYERCLEAR, value: { name: 'folderMoving' } }); // 取消弹层
            proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
          }
        });
      } else if (item.key === UPLOADESERVE) {
        // 上方按钮-上传
        proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
      } else if (item.key === CUSTOMEVENTSERVE) {
        // // dyIcons[0].state.form[4].value?.length > 0 ? (dyIcons[0].state.form[4].state.default.permission = null) : (dyIcons[0].state.form[4].state.default.permission = 2);
        if (dyIcons[0].state.form[4].value?.length > 0) {
          dyIcons[0].state.form[4].value[1] = { permission: null, memberIds: [] };
          dyIcons[0].state.form[4].state.default.permission = null;
          dyIcons[0].state.form[4].state.default.memberIds = [];
          // } else {
          //   dyIcons[0].state.form[4].state.default.permission = 2;
          //   dyIcons[0].state.form[4].state.default.memberIds = [state.id];
        }
      }
    } catch (error) {
      message.error(error);
    }
  });
// 监听table
const subscribeSubTab = proxy.$NotificationPubSub
  .getParams()
  .pipe(filter((res) => res !== 0))
  .subscribe((item: any) => {
    try {
      if (item.key === DYNAMICLAYERFORM && item.value.config.name === 'projectFile') {
        // 一级文件目录添加不允许权限分配
        // item.value.form[3].hidden = state.level === 0 ? true : false;
        // item.value.form[4].hidden = state.level === 0 ? true : false;
        // 添加权限时的默认值
        item.value.form[4].value[0] = { permission: 2, memberIds: [state.id] };
        item.value.form[4].state.default.permission = 2;
        item.value.form[4].state.default.memberIds = [state.id];
      } else if (item.key === DYNAMICLOCALTABLE && item.value.part.text === '详情') {
        state.currentLevel = item.value.data.level;
        // table按钮-详情
        projectGet(item.value.data.id).then((result) => {
          if (result.success) {
            state.showType = 'VIEW';
            state.showDetail = true;
            state.showData = result.data;
          }
        });
      } else if (item.key === DYNAMICLAYERTABLE && item.value.name === 'projectFileVersion') {
        // 拥有上传权限和新建权限才能显示回滚按钮
        if (item.value.config.params.fileId) {
          state.filePage.forEach((reItem) => {
            if (reItem.id === item.value.config.params.fileId) {
              dyTable[6].handle[3].state.options[1].state.table[5].handle[1].hidden = !reItem.canUpload || !reItem.canCreate;
            }
          });
        }
      } else if (item.key === DYNAMICLAYERFORM && item.value.config.title === '重命名') {
        // 全局查询完后, 回到当前层级重置
        dyTableConfig.params.parentId = state.selectedKeys[0];
      } else if (item.key === DYNAMICLOCALTABLE && item.value.part.text === '回滚到该版本' && item.value.part.state.name === 'VERSION_BACK') {
        Modal.confirm({
          title: '回滚提示',
          icon: createVNode(ExclamationCircleOutlined),
          content: '原文件将会被覆盖，是否确定回滚该文件？',
          cancelText: '取消',
          okText: '确认',
          onOk() {
            setAsCurrent(item.value.data.id).then((res) => {
              if (res.success) {
                message.success('确认成功');
                proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
                proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFileVersion' } }); // 更新历史版本table
              }
            });
          }
        });
      } else if (item.key === DYNAMICLOCALTABLE && item.value.part.text === '下载' && item.value.part.state.name == 'VERSION_DOWN') {
        // table按钮-版本下载
        if (downloadLimit(item.value.data.size)) {
          message.warning('该文件夹或文件已超过500M，请使用客户端下载');
          return;
        }
        downloadFile(`${Api.versionDownload}/${item.value.data.id}`, 'GET');
      } else if (item.key === DYNAMICLOCALTABLE && [item.value.part.text, item.value.part.label].includes('下载')) {
        // table按钮-下载
        if (downloadLimit(item.value.data.size)) {
          message.warning('该文件夹或文件已超过500M，请使用客户端下载');
          return;
        }
        const params = {
          id: item.value.data.id,
          folder: item.value.data.folder,
          subsystem: SUB_SYSTEM.DMS
        };
        downloadFile(Api.projectDownload, 'POST', params);
      } else if (item.key === DYNAMICLTABLEDELETE && item.value.part.label == '删除') {
        // table按钮-删除完成回调
        getProjectFileTree(); // 更新目录
      } else if (item.key === DYNAMICLOCALICONS && item.value.value === '下载') {
        // 上方按钮-批量下载
        if (item.state.selected.length > 0) {
          // 判断所选项目是否具有下载权限
          let isDownload, isError;
          item.state.selected.forEach((reItem) => {
            if (!reItem.canDownload) {
              message.warning(`该账号不具备【${reItem.name}】的下载权限`);
              isDownload = true;
            } else if (downloadLimit(reItem.size)) {
              message.warning(`${reItem.name}大小已超过500M，请使用客户端下载`);
              isError = true;
            }
          });
          if (isDownload || isError) return;
          const params = item.state.selected.map((reItem) => ({
            folder: reItem.folder,
            id: reItem.id,
            subsystem: SUB_SYSTEM.DMS
          }));
          downloadFile(Api.projectBatchDownload, 'POST', params);
        } else {
          message.warning('请先选中一个选项');
        }
      } else if (item.key === DYNAMICLOCALICONS && item.value.value === '删除') {
        // 上方按钮-批量删除
        if (item.state.selected.length > 0) {
          Modal.confirm({
            title: '删除提示框',
            okText: '确认',
            cancelText: '取消',
            content: '是否确认删除所选内容？',
            onOk() {
              // 判断所选项目是否具有删除权限
              let isDelete;
              item.state.selected.forEach((reItem) => {
                if (!reItem.canDelete) {
                  message.warning(`该账号不具备【${reItem.name}】的删除权限`);
                  isDelete = true;
                }
              });
              if (isDelete) return;
              const parameterList = item.state.selected.map((reItem) => ({
                folder: reItem.folder,
                id: reItem.id,
                subsystem: SUB_SYSTEM.DMS
              }));
              projectBatchDelete({ parameterList }).then((res) => {
                if (res.success) {
                  message.success('删除成功');
                  getProjectFileTree();
                  proxy.$NotificationFormSub.pushParams({ key: RESETTABLE, value: { name: 'projectFile' } }); // 更新table
                }
              });
            }
          });
        } else {
          message.warning('请先选中一个选项');
        }
      }
    } catch (error) {
      message.error(error);
    }
  });

// 添加每节点层级关系
// const hierarchicalDisplay = (arr: any, hierarchyValue: string = '') => {
//   return arr.map((item) => ({
//     hierarchy: (hierarchyValue ? `${hierarchyValue}/` : '') + item.name,
//     label: item.name,
//     value: item.id,
//     categorize: item.categorize,
//     id: item.id,
//     children: Array.isArray(item.children) ? hierarchicalDisplay(item.children, (hierarchyValue ? `${hierarchyValue}/` : '') + item.name) : null
//   }));
// };

// 下载文件是否超过上限500M
function downloadLimit(size) {
  if (size >= 524288000) {
    return true;
  }
}

// // 是否是第一层级
// const isFirstLev = computed(() => state.level === 0);
// // 第一次层级允许添加水印
// watch(
//   isFirstLev,
//   (newVal) => {
//     dyIcons.forEach((item) => {
//       if (item.key == 'layerFrom') {
//         // item.state.form.forEach((frItem) => {
//         //   if (frItem.key == 'watermarkingId') {
//         //     frItem.hidden = !newVal;
//         //   }
//         // });
//       }
//     });
//   },
//   { immediate: true }
// );
// 是否是第二层级
const isSecendLev: any = computed(() => state.level === -1);
// 第二次层级允许添加水印
watch(
  isSecendLev,
  (newVal) => {
    dyIcons.forEach((item) => {
      if (item.key == 'layerFrom') {
        item.state.form.forEach((frItem) => {
          if (['title', 'projectFilePermissionDTOS', 'watermarkingId'].includes(frItem.key)) {
            frItem.hidden = !newVal;
          }
        });
      }
    });
  },
  { immediate: true }
);
// 是否是第一，第二层级
const is2ndLev = computed(() => !dyTableConfig.params.parentId || state.treeData[0]?.children.map((item) => item.id).includes(dyTableConfig.params.parentId) || !state.permission[0]?.canUpload);
// 第一，第二层级不可上传文件
watch(
  is2ndLev,
  (newVal) => {
    dyIcons.forEach((item) => {
      if (item.key == 'upload') item.hidden = newVal;
    });
  },
  { immediate: true }
);
// 添加按钮是否具有权限;
const isAdd = computed(() => state.level !== -1 && state.permission[0]?.canCreate);
watch(
  isAdd,
  (newVal) => {
    dyIcons.forEach((item) => {
      if (item.value == '添加文件夹') item.hidden = !newVal;
    });
  },
  { immediate: true }
);
// 删除按钮是否具有权限(全部层级本身不具有删除按钮);
const isDelete = computed(() => state.level !== -1);
watch(
  isDelete,
  (newVal) => {
    dyIcons.forEach((item) => {
      if (item.value == '删除') item.hidden = !newVal;
    });
  },
  { immediate: true }
);
// 下载按钮是否具有权限
// const isDownload = computed(() => state.permission[0]?.canDownload);
// watch(
//   isDownload,
//   (newVal) => {
//     dyIcons.forEach((item) => {
//       if (item.value == '下载') item.hidden = !newVal;
//     });
//   },
//   { immediate: true }
// );

onMounted(async () => {
  state.expandedKeys = [''];
  await getViewTree();
});

// 初始化 =>Promise.all()
function getViewTree() {
  projectGetChildrenFolders({ name: '' }).then((result) => {
    if (result.success) {
      state.treeData = [{ name: '全部', id: '', children: result.data, level: -1 }];
      state.selectedKeys = [result.data[0].id]; // 默认选中第一个
      dyTableConfig.params.parentId = result.data[0].id; // 默认展示的第一个文件夹的子项
      fileOptlist({ ids: [dyTableConfig.params.parentId] }).then((result) => {
        if (result.success) {
          state.permission = result.data; // 默认展示第一个文件夹的权限icon按钮
        }
      });
      let finalData = breadcrumb(state.treeData, result.data[0].id);
      breadcrumbs.value = finalData;
      fileRef.value.getData();
    }
  });
}

// 获取和更新项目文件目录
function getProjectFileTree() {
  projectGetChildrenFolders({ name: '' }).then((result) => {
    if (result.success) {
      state.treeData = [{ name: '全部', id: '', children: result.data, level: -1 }];
    }
  });
}
// 搜索获取项目文件目录
function getFolderTree() {
  const params = {
    name: state.searchName
  };
  projectGetChildrenFolders(params).then((result) => {
    if (result.success) {
      state.searchData = [{ name: '全部', id: '', children: result.data, level: -1 }];
    }
  });
}
// 监听搜索值的变化
let searching: any = ref();
const isSearch = computed(() => state.searchName === '');
watch(
  isSearch,
  (newVal) => {
    searching.value = newVal;
  },
  { immediate: true }
);

// 点击文件夹
function folderClick(node) {
  if (node.id) {
    fileOptlist({ ids: [node.id] }).then((result) => {
      if (result.success) {
        state.permission = result.data;
      }
    });
  } else {
    state.permission = [];
  }

  // 修改上传按钮传参
  for (let i = 0; i < dyIcons.length; i++) {
    if (dyIcons[i].key == 'upload') {
      dyIcons[i].state.params.directoryId = node.id;
    }
  }
  // table传参
  state.selectedKeys[0] = node.id;
  state.level = node.level;
  dyTableConfig.params.parentId = node.id;
  let finalData = breadcrumb(state.treeData, node.id);
  breadcrumbs.value = finalData;
  fileRef.value.getData();
}

//面包屑
function breadcrumb(arr: any, key: any, finalData: Array<any> = []) {
  for (let i = 0, len = arr.length; i < len; i++) {
    finalData.push({ name: arr[i].name, id: arr[i].id });
    if (arr[i].id === key) {
      return finalData;
    } else if (arr[i].children && arr[i].children.length >= 1) {
      if (breadcrumb(arr[i].children, key, finalData) != false) return finalData;
    }
    finalData.pop();
  }
  return false;
}
// 点击文件
function fileClick(node) {
  const params = { id: node.id, expires: 2, timeUnit: 'HOURS' };
  fileGetPreviewFileUrl(params).then((res) => {
    if (res.success && res.data) {
      reviewFile(res.data);
    }
  });
}
// 目录编辑
function handleEdit(data) {
  state.showDetail = false;
  nextTick(() => {
    state.showType = 'EDIT';
    state.showDetail = true;
    state.showData = data;
  });
}

onBeforeUnmount(() => {
  subscribeSub && subscribeSub.unsubscribe();
  proxy.$NotificationFormSub.clearParams();
  subscribeSubTab && subscribeSubTab.unsubscribe();
  proxy.$NotificationPubSub.clearParams();
});
</script>

<style lang="less" scoped>
:deep(.tree-warpper) {
  .ant-tree-switcher {
    line-height: 36px;
  }

  .ant-tree-node-content-wrapper {
    min-height: 36px;
    line-height: 36px;

    &.ant-tree-node-selected {
      background-color: #e5eefd;
      color: #005aea;
    }
  }
}
:deep(.ant-modal) {
  .ant-table-thead .ant-table-cell {
    // background-color: red !important;
  }
}
.content {
  @apply text-black text-opacity-45;

  p:nth-child(2) {
    display: inline-block;
  }
}
.fix-margin {
  p {
    margin: 0px !important;
  }
}
/deep/.ant-tree-node-content-wrapper {
  display: flex;
  align-items: center;
}
.over {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
/deep/.ant-tree-title {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.hierarchy {
  cursor: pointer;
}

.hierarchy:hover {
  color: #409eff;
}
</style>
